.popup_cr.bln{

}

.mask{
  position: fixed;
  top : 0;
  bottom: 0;
  left : 0;
  right : 0;
  z-index : 2000;
  overflow: auto;
  display: block;
  background-color: rgb(0,0,0);
  opacity: 0.7;
}

// todo : open style to custom do not use important
.popup_panel{
  position: absolute;
  z-index : 10000;
  left : 50%;
  right : 50%;
  transform: translate(-360px,0);
  width : 720px;
  top : 120px;
  background-color: #fff;
  border: 1px solid #BFC2C5;

  .panel_title{
    height : 55px;
    line-height : 55px;
    border-bottom: 1px solid #BFC2C5;
    padding : 0 15px;

    span.title {
      font-size : 16px;
      font-weight: bold;
      vertical-align: middle;
    }

    span.cancel{
      a{
        text-decoration: none;
      }

      float : right;
      vertical-align: middle;
    }
  }

  .panel_content{
    padding : 0 15px;
  }

  .panel_content.fluid{
    padding : 0;
  }

  .panel_ctrl{
    height : 65px;
    background-color: #F0F4F7;
    text-align: center;
    border-top : 1px solid #c7c7c7;
    padding : 10px 0;

    .btn{
      height : 34px;
      width : 66px;
      border-radius: 4px;
      border : 1px solid #c7c7c7;
      padding : 5px 10px;
      font-size : 14px;
      display: inline-block;
      cursor: pointer;
      vertical-align: middle;
    }

    .btn:first-child{
      margin-right: 10px;
    }

    .btn:last-child{
      margin-left : 10px;
    }

    .btn.btn-primary{
      background-color : #2277da;
      color : white;
    }

    .btn.btn-default{
      background-color : #fff;
    }
  }

  .panel_ctrl:before{
    content : "";
    height  : 100%;
    vertical-align: middle;
    display: inline-block;
  }
}

.popup_cr.show{
}

.popup_cr.pop_in{
  display: block;
  visibility: hidden;
  transition: width,height .5s,.5s;
}

.popup_cr.hide{
  display: none;
}